<template>
  <a-upload
    :custom-request="chunkedUpload"
    ref="chunkedUpload"
    :action="uploadUrl"
    :data="uploadData"
    :remove="beforeRemove"
    name="file">
    <a-button size="small" type="primary">点击上传</a-button>
  </a-upload>
</template>

<script>
import chunkedUpload from '@/utils/chunkedUpload'
import { axios } from '@/utils/request'
import {message } from 'ant-design-vue';

export default {
  name: "FileChunkUpload",
  data() {
    return {
      uploadData: {
        //这里面放额外携带的参数
      },
      //文件上传的路径
      uploadUrl: '/sys/fileUpload/chunk/upload', //文件上传的路径
      chunkedUpload: chunkedUpload // 分片上传自定义方法，在头部引入了
    }
  },
  methods: {
    beforeRemove(file) {
      // 调用删除接口
      const data = {
        fileName: file.name, // 文件名
        fileSize: file.size // 文件大小
      }
      axios({
        method: 'post',
        url: '/sys/fileUpload/chunk/delete',
        data: data
      }).then(res => {
        if (res.data.code !== '200') {
           this.$message.error(res.data.msg)
        } else {
           this.$message.error("删除成功")
        }
      })
    }
  }
}
</script>

<style scoped>

</style>